<template>
  <el-dialog title="新增员工" :visible="showDialog" @close="quxiao">
    <!-- 表单 -->
    <el-form ref="formdata" label-width="120px" :model="formData" :rules="rules">
      <el-form-item label="广告名称" prop="title">
        <el-input v-model="formData.title" style="width:50%" placeholder="请输入标题" />
      </el-form-item>
      <el-form-item label="封面图" prop="fmiantu">
        <el-input v-model="formData.fmiantu" style="width:50%" placeholder="请输入标题" />
      </el-form-item>
      <el-form-item label="展示端" prop="kehudua">
        <el-select v-model="formData.kehudua" style="width:50%" placeholder="请选择">
          <el-option value="物业端" />
          <el-option value="业主端" />
        </el-select>
      </el-form-item>
      <el-form-item label="展现类型" prop="leixing">
        <el-select v-model="formData.leixing" style="width:50%" placeholder="请选择">
          <el-option value="外链" />
          <el-option value="富文本" />
        </el-select>
      </el-form-item>
      <el-form-item label="推送状态" prop="tuisong">
        <el-select v-model="formData.tuisong" style="width:50%" placeholder="请选择">
          <el-option value="是" />
          <el-option value="否" />
        </el-select>
      </el-form-item>
      <el-form-item label="是否在主页显示" prop="shouye">
        <el-select v-model="formData.shouye" style="width:50%" placeholder="请选择">
          <el-option value="是" />
          <el-option value="否" />
        </el-select>
      </el-form-item>
      <el-form-item label="链接地址" prop="dizhi">
        <el-input v-model="formData.dizhi" style="width:50%" placeholder="请输入标题" />
      </el-form-item>
    </el-form>
    <!-- footer插槽 -->
    <el-row type="flex" justify="center">
      <el-col :span="6">
        <el-button size="small" @click="quxiao">取消</el-button>
        <el-button type="primary" size="small" @click="queding">确定</el-button>
      </el-col>
    </el-row>

  </el-dialog>
</template>

<script>
export default {
  props: {
    showDialog: {
      type: Boolean,
      default: false
    },
    roww: {
      type: Object
    }
  },
  data() {
    return {
      formData: {
        kehudua: '',
        title: '',
        fmiantu: '',
        shouye: '',
        leixing: '',
        tuisong: '',
        dizhi: ''
      },
      rules: {
        title: [{ required: true, message: '广告名称不能为空', trigger: 'blur' }],
        fmiantu: [{ required: true, message: '封面图不能', trigger: 'blur' }],
        kehudua: [{ required: true, message: '客户端不能为空', trigger: 'blur' }],
        shouye: [{ required: true, message: '首页显示形式不能为空', trigger: 'blur' }],
        tuisong: [{ required: true, message: '推送形式不能为空', trigger: 'blur' }],
        dizhi: [{ required: true, message: '地址不能为空', trigger: 'blur' }],
        leixing: [{ required: true, message: '类型不能为空', trigger: 'blur' }]
      },
      no: ['业主端', '物业端']
    }
  },
  methods: {
    quxiao() {
      this.$emit('update:showDialog', false)
      //   this.$message('取消')
      this.formData = {
        kehudua: '',
        title: '',
        fmiantu: '',
        shouye: '',
        leixing: '',
        tuisong: '',
        dizhi: ''
      }
    },
    async queding() {
      try {
        if (await this.$refs.formdata.validate() === false) return
        this.$message.success('校验成功')
        this.$emit('update:showDialog', false)
        this.$emit('jiao', this.formData)
      } catch (err) {
        console.log(err)
      }

    //   this.$message.success('确定')
    }
  }
}
</script>

<style>

</style>
